import type { Directive, DirectiveBinding } from "vue";
import {useUserStore} from "@/stores/user";
// --指令是什么
// 是对某个DOM功能操作的封装
export const focus: Directive = {
    mounted(el: HTMLElement, binding: DirectiveBinding<string>) {
        // console.log(el, binding)
        el.focus()
    },
};
export const color: Directive = {
    mounted(el: HTMLElement, binding: DirectiveBinding<string>) {
        el.style.color = binding.value;
    },
    updated(el, binding) {
        el.style.color = binding.value;
    },
};
// 管理员权限特殊处理
const adminPerms = '*:*:*'
export const auth: Directive = {
    mounted(el: HTMLElement, binding: DirectiveBinding<string>) {
        const store = useUserStore()
        const permissions = store.profile.permissions
        // 管理员的
        if (permissions.includes(adminPerms)) {
            return
        }
        // 如果是其它用户的
        if(!permissions.includes(binding.value)){
            // 删除自身
            el.remove()
        }
    },
};